/** 
 股票指令
*/
import React from 'react';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Row, Col } from 'antd';
import { SecuritiesCodeC, codeType, InputNumberC, TradingMarketC } from '../../../../comps';
import FormItemLayout from './formItemLayout';
@Form.create()
class StockTrade extends React.Component {
  state = {
    exchangecode: '', //交易市场
    securityCode: undefined, //证券代码
  };

  componentDidMount() {
    this.props.onRef(this);
  }

  UNSAFE_componentWillReceiveProps(nextProps) {}
  // 证券代码change事件
  tradingCodeOnChange = (e) => {
    if (e) {
      this.props.tradingCodeOnChange(e);
      this.setState({
        exchangecode: e.exchangeCode,
      });
    } else {
      this.setState({
        exchangecode: '',
      });
    }
  };
  // 数量的change事件
  NumChange = (e) => {
    const { getFieldsValue, setFieldsValue } = this.props.form;
    const formValues = getFieldsValue();
    const netPriceTemp = formValues.realOrderPrice;
    if (e && netPriceTemp) {
      setFieldsValue({
        totalPrice: e * netPriceTemp,
      });
    } else {
      setFieldsValue({
        totalPrice: '',
      });
    }
  };
  // 全价价格的change事件
  netPriceChange = (e) => {
    const { getFieldsValue, setFieldsValue } = this.props.form;
    const formValues = getFieldsValue();
    const NumTemp = formValues.realOrderQty;
    if (e && NumTemp) {
      setFieldsValue({
        totalPrice: e * NumTemp,
      });
    } else {
      setFieldsValue({
        totalPrice: '',
      });
    }
  };
  // 抛出的getInfo事件
  getInfo = () => {
    const {
      form: { validateFields, getFieldsValue },
    } = this.props;
    const formValues = getFieldsValue();
    let flag = false;
    let query = undefined;
    validateFields((errors) => {
      if (errors) {
        return;
      } else {
        flag = true;
      }
    });
    if (flag) {
      query = formValues;
      query.tradingcode = this.state.securityCode.tradingCode;
      return query;
    } else {
      return;
    }
  };
  render() {
    return (
      <div>
        <Form>
          <Row>
            <Col span={24} style={{ marginBottom: '10px' }}>
              <SecuritiesCodeC
                title='证券代码'
                dataIndex={'tradingcode'}
                form={this.props.form}
                rules={[{ required: true, message: '请选择证券代码' }]}
                codeType={codeType.gp}
                extraLayout={FormItemLayout}
                onChange={(e) => {
                  this.setState({
                    securityCode: e,
                  });
                  this.tradingCodeOnChange(e);
                }}
              />
            </Col>
          </Row>
          <Row>
            <Col span={24} style={{ marginBottom: '10px' }}>
              <TradingMarketC
                title='交易市场'
                form={this.props.form}
                dataIndex={'exchangecode'}
                formItemLayout={FormItemLayout}
                marketType={['jys', 'yhj', 'cw', 'qt']}
                initialValue={this.state.exchangecode}
                rules={[{ required: true, message: '请选择证券代码' }]}
                disabled={true}
              />
            </Col>
          </Row>
          <Row>
            <Col span={24} style={{ marginBottom: '10px' }}>
              <InputNumberC
                dataIndex='realOrderQty'
                title={'成交数量'}
                precision={0}
                min={0}
                splitStyle={true}
                rules={[
                  { required: true, message: '请输入' },
                  { pattern: /^[+-]?(\d){1,}0$/, message: '请输入10的倍数' },
                ]}
                form={this.props.form}
                formItemLayout={FormItemLayout}
                onChange={this.NumChange}
                unit='张'
              />
            </Col>
          </Row>
          <Row>
            <Col span={24} style={{ marginBottom: '10px' }}>
              <InputNumberC
                dataIndex='realOrderPrice'
                title={'成交价格'}
                precision={4}
                min={0}
                splitStyle={true}
                rules={[{ required: true, message: '请输入' }]}
                form={this.props.form}
                formItemLayout={FormItemLayout}
                onChange={this.netPriceChange}
                unit='元'
              />
            </Col>
          </Row>
          <Row>
            <Col span={24} style={{ marginBottom: '10px' }}>
              <InputNumberC
                dataIndex='totalPrice'
                title={'金额'}
                precision={4}
                min={0}
                splitStyle={true}
                rules={[{ required: true, message: '请输入' }]}
                form={this.props.form}
                formItemLayout={FormItemLayout}
                disabled={true}
                unit='元'
              />
            </Col>
          </Row>
        </Form>
      </div>
    );
  }
}
export default StockTrade;
